<template>
  <div >
    <!-- 搜索条件 -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline">
        <a-row :gutter="48">
          <a-col :md="8" :sm="24">
            <a-form-item label="创建日期">
              <a-range-picker @change="onChange" />
            </a-form-item>
          </a-col>

          <a-col :md="8" :sm="24">
            <span class="table-page-search-submitButtons" >
              <a-button type="primary" icon="search" @click='loadData'>查询</a-button>
              <a-button type="primary" style="margin-left: 8px"  icon="reload" @click='reload'>重置</a-button>
            </span>
          </a-col>
        </a-row>
      </a-form>
    </div>

        <div class="table-operator">
          <a-button @click="gotoStatistics" type="primary" >办理情况统计</a-button>
        </div>

    <a-table
      :row-key="record => record.id"
      ref="table"
      size="middle"
      :scroll="{ x: 'max-content' }"
      bordered
      :columns="columns"
      :dataSource="dataSource"
      :pagination="ipagination"
      @change="handleTableChange"
      :loading="loading"
    >
    <span slot="action" slot-scope="text, record">
    <a @click='handleDetail(record.id)'> 详情 </a>
    <a-divider type='vertical' />
    <a @click='download(record.id)' ><a-icon type="download"/> 下载 </a>
    <a-divider type='vertical' />
    <a-popconfirm title="确定删除吗?" @confirm="() => delTemporary(record.id)">
    <a > 删除 </a>
    </a-popconfirm>
    </span>
    </a-table>
    <temporary-order-detail-modal ref="detailModal"></temporary-order-detail-modal>
  </div>
</template>

<script>

import HandleTemporaryService from '@/myService/HandleTemporaryService'
import NBAreDict from '@views/data-governance/smart-reports/handle-monthly/components/NBAreDict'
import TemporaryOrderDetailModal
  from '@views/data-governance/smart-reports/handle-monthly/components/TemporaryOrderDetailModal'


export default {
  components: {
    TemporaryOrderDetailModal,
  },
  data () {
    return {
      areaOptions:NBAreDict.area,
      // 查询参数
      queryParam: {
        beginDate:'',
        endDate:'',
        pageSize: 10,
        pageIndex:1,
      },
      /* 数据源 */
      dataSource:[],
      /* 分页参数 */
      ipagination:{
        current: 1,
        pageSize: 10,
        pageSizeOptions: ['10', '20', '30'],
        showTotal: (total, range) => {
          return range[0] + "-" + range[1] + " 共" + total + "条"
        },
        showQuickJumper: true,
        showSizeChanger: true,
        total: 0
      },
      // 表头
      columns: [
        {
          title: '#',
          dataIndex: '',
          key: 'rowIndex',
          width: 60,
          align: 'center',
          customRender: (text, row, index) => <span>{this.ipagination.pageSize * (this.ipagination.current - 1) + index + 1}</span>
        },
        {
          title: '创建时间',
          dataIndex: 'createTime',
          align: 'center',
        },
        {
          title: '开始日期',
          dataIndex: 'beginDate',
          align: 'center',
        },
        {
          title: '结束日期',
          dataIndex: 'endDate',
          align: 'center',
        },
        {
          title: '信访形式',
          align:'center',
          dataIndex: 'xfxs',
          customRender: function (text){
            if(text=='00'){
              return "全部";
            }else if(text=='04'){
              return "来电";
            }else if(text=='02'){
              return "来访";
            }else if(text=='01'){
              return "来信";
            }else if(text=='03'){
              return "网上信访";
            }else if(text=='06'){
              return "领导信箱";
            }
          }
        },
        {
          title: '大区域',
          align:'center',
          dataIndex: 'isCenter',
        },
        {
          title: '问题属地',
          align:'center',
          dataIndex: 'problemTerritory',
        },
        {
          title: '去向区县',
          align:'center',
          dataIndex: 'xzqh',
          customRender: function (text){
           return NBAreDict.getXzqh(text)
          }
        },

        {
          title: '去向部门',
          align:'center',
          dataIndex: 'department',
        }, {
          title: '自办量',
          dataIndex: 'replyNum',
          align: 'center',
        },
        {
          title: '同比',
          dataIndex: 'replyYoy',
          align: 'center',
        },
        {
          title: '转办量',
          dataIndex: 'transferNum',
          align: 'center',
        },
        {
          title: '同比',
          dataIndex: 'transferYoy',
          align: 'center',
        },
        {
          title: '自办率',
          align: 'center',
          dataIndex: 'replyRate',
        },
        {
          title: '意见建议',
          align: 'center',
          dataIndex: 'opinionNum',
        },
        {
          title: '申诉类',
          align: 'center',
          dataIndex: 'appealNum',
        },
        {
          title: '求决类',
          align: 'center',
          dataIndex: 'decideNum',
        },
        {
          title: '揭发控告',
          align: 'center',
          dataIndex: 'exposeNum',
        },
        {
          title: '咨询类',
          align: 'center',
          dataIndex: 'adviceNum',
        },
        {
          title: '其他',
          align: 'center',
          dataIndex: 'otherNum',
        },
        {
          title: '重件',
          align: 'center',
          dataIndex: 'repeatNum',
        },
        {
          title: '未评价件',
          align: 'center',
          dataIndex: 'notEvaluatedNum',
        },
        {
          title: '不满意件',
          align: 'center',
          dataIndex: 'dissatisfiedNum',
        },
        {
          title: '满意基本满意件',
          align: 'center',
          dataIndex: 'satisfiedNum',
        },
        {
          title: '满意率',
          align: 'center',
          dataIndex: 'satisfiedRate',
        },
        {
          title: '操作',
          key: 'action',
          align:'center',
          fixed: 'right',
          scopedSlots: { customRender: 'action' },
        },
      ],
      /* table加载状态 */
      loading:false,
      // 加载数据方法 必须为 Promise 对象
    }
  },
  created () {
    this.loadData()
  },
  methods: {
    loadData() {
      this.loading = true;
      this.dataSource=[];
      this.ipagination.total=0;
      this.queryParam.pageSize=this.ipagination.pageSize;
      this.queryParam.pageIndex=this.ipagination.current;
      HandleTemporaryService.getPeriodStatistics(this.queryParam).then((res) => {
        if (res.success) {
          this.dataSource = res.result.records||res.result;
          if(res.result.total)
          {
            this.ipagination.total = res.result.total;
          }else{
            this.ipagination.total = 0;
          }
        }else{
          this.$message.warning(res.message);
        }
      }).finally(() => {
        this.loading = false;
      })
    },
    reload(){
      this.queryParam={
        beginDate:'',
        endDate:'',
        pageSize: 10,
        pageIndex:1,
      }
      this.ipagination.pageSize=10;
      this.ipagination.current=1;
      this.loadData();
    },
    onChange(date, dateString) {
      this.queryParam.beginDate=dateString[0]
      this.queryParam.endDate=dateString[1]
    },

    handleTableChange(pagination){
      this.ipagination.current = pagination.current;
      this.ipagination.pageSize = pagination.pageSize;
      this.loadData();
    },
    handleDetail(id){
      this.$refs.detailModal.open(id)
    },
    download(id){
      this.downLoading=true;
      HandleTemporaryService.downLoadTemporaryOrder(id).catch(err=> {
        this.$message.info("正在制作EXCEL，请稍后重试")
      }).finally(()=>{
        this.downLoading=false;
      })
    },
    delTemporary(id){
      let that=this;
      that.loading = true;
      HandleTemporaryService.delTemporary(id).then(res=>{
        if(res.success){
          this.$message.success("删除成功")
          that.loadData()
        } else {
          that.$message.warning(res.message);
        }
      }).finally(() => {
        that.loading = false;
      });
    },
    gotoStatistics(){
      this.$router.push("/report/handle-temporary")
    }
  },
}
</script>